<template>
  <dv-water-level-pond :config="chartConfig" style="height: 100%;width: 100%"/>
</template>
<script>
import {defineComponent, reactive, toRefs} from "vue";

//水位图
export default defineComponent({
  name: 'dv-chart-water-level-pond',
  props: {
    workBook: {type: Object}
  },
  setup() {
    const state = reactive({
      chartConfig: {
        data: [],
        shape: 'roundRect'
      }
    })
    /**
     * 图表实现方法
     * @param data 数据
     * @param columnFields 列字段
     * @param rowFields 行字段
     * @param chartMode 图表类型
     * @param options 配置项
     */
    const build = (data, columnFields, rowFields, chartMode, options) => {
      return new Promise((resolve, reject) => {
        const allFields = columnFields.concat(rowFields)
        //度量
        let measureFields = allFields.find(d => d.slaveType === 1);
        state.chartConfig.data = [data[0][measureFields.name]]
        state.chartConfig = {...state.chartConfig}
        resolve({})
      })
    }

    return {

      build, ...toRefs(state)
    }
  }
})
</script>
